/*
 * name: optionList
 * version: v1.0.0
 * update: 参数格式调整
 * date: 2016-02-20

//demo
 var demo = optionList({
    selector:'#View',
    data:[
        {
            item:'这是一个列表',
            className:'first'
        },{
            item:'这是一个列表'
        }
    ],
    buttons:[
        {
            text:'编辑'
        },{
            className:'btn-danger',
            text:'删除'
        }
    ],
    onClick:function(button, itemIndex, itemLength){
        var optionIndex = $(button).index();
        if(optionIndex==0){
            console.log('编辑')
        }else if(optionIndex==1){
            demo.delete(itemIndex)
        }
    }
})
 */
define('optionList', function(require, exports, module) {
    seajs.importStyle('.item-right-options{padding:0}\
.item-content{position:relative;z-index:2;padding:16px;border:none;background-color:#fff}\
.item-options{position:absolute;z-index:1;top:0;right:0;height:100%}\
.item-options .btn{display:-webkit-inline-box;display:-webkit-inline-flex;display:-moz-inline-flex;display:-ms-inline-flexbox;display:inline-flex;box-sizing:border-box;height:100%;border:none;border-radius:0;-webkit-box-align:center;-ms-flex-align:center;-webkit-align-items:center;-moz-align-items:center;align-items:center}'
        , module.uri);
    var item_temp = '<li class="item item-right-options scrollSelectItem ${className}">\
            <div class="item-content scrollSelectContent"> ${item|raw} </div>\
        </li>',
        button_temp = '<div class="item-options scrollSelectOptions">\
            <!-- for: ${buttons} as ${btn}, ${index} --><div class="btn ${btn.className}"> ${btn.text} </div><!-- /for -->\
        </div>',
        bounceState,
        item_render = etpl.compile(item_temp),
        button_render = etpl.compile(button_temp);
    var OptionListView = function(option) {
        var self = this;
        self.option = $.extend({
            selector: "body",
            multiShow: false,
            duration: "300ms",
            touchClass: "activated",
            id: appcan.getUID()
        }, option, true);
        self.ele = $(self.option.selector);
        //method
        self.delete = OptionListView.prototype.delete;
        self.add = OptionListView.prototype.add;

        if (self.option.data) {
            return self.set(self.option.data);
        }
        return self;
    };

    OptionListView.prototype = {
        buildListview: function(newData) {
            var container = "<ul class='list'>";
            var self = this;
            var data = $.isArray(newData) && newData.length ? newData : self.data;
            for (var i in data) {
                var ele = item_render(data[i]);
                container += ele;
            }
            var startX = 0,
                startY = 0,
                moveX = 0,
                moveY = 0;
            var delWidth = $(".scrollRight").width();
            var startMarginLeft = 0;
            var scrollEnable = true; //是否允许左右滑动
            var flag = 0; //是否已经计算过角度
            var mousedown = false;

            //返回角度
            function angle(start, end) {
                var diff_x = end.x - start.x,
                    diff_y = end.y - start.y;
                return 360 * Math.atan(diff_y / diff_x) / (2 * Math.PI);
            };
            self.ele.get(0).addEventListener('touchstart', function(evt) {
                var that = evt.target,
                    $btns;
                if($(that).parents('.scrollSelectContent').length){
                    that = $(that).parents('.scrollSelectContent').get(0);
                };
                $btns = $(that).siblings(".scrollSelectOptions");
                if(!$btns.length){
                    $btns = $(button_render(self.option));
                    $(that).parents('.scrollSelectItem').append($btns);
                };
                $(that).parents('.scrollSelectItem').addClass('showOption');
                if ($(that).hasClass('scrollSelectContent')) {
                    $(that).addClass(self.option.touchClass);
                    if (bounceState == 1) {
                        appcan.window.disableBounce();
                    }
                    
                    if (!self.option.multiShow) {
                        $(that).parents('.scrollSelectItem').siblings().find('.scrollSelectContent').each(function(i,e){
                            e.style.transitionDuration = "100ms";
                            e.style.left = "0px";
                        });
                    };
                    scrollEnable = true;
                    flag = 0; //是否已经计算角度标记
                    var touch = evt.touches[0];
                    startX = touch.pageX; //起始x坐标
                    startY = touch.pageY; //起始Y坐标
                    moveX = touch.pageX; //移动X坐标
                    moveY = touch.pageY; //移动Y坐标
                    startMarginLeft = parseInt($(that)[0].style.marginLeft); //起始marginLeft
                    delWidth = $btns.width() || 0; //
                    $(".item-content").get(0).style.transitionDuration = "0ms";
                }
            }, false);
            self.ele.get(0).addEventListener('touchmove', function(evt) {
                var that = evt.target;
                //滑动区域
                if($(that).parents('.scrollSelectContent').length){
                    that = $(that).parents('.scrollSelectContent').get(0);
                }
                if ($(that).hasClass('scrollSelectContent')) {
                    if (scrollEnable == false) {
                        return;
                    } else {
                        var touch = evt.touches[0];
                        moveX = touch.pageX;
                        moveY = touch.pageY;
                        if (isNaN(startMarginLeft)) {
                            startMarginLeft = 0;
                        }
                        var marginLeft = startMarginLeft + moveX - startX;
                        marginLeft > 0 && (marginLeft = 0);//不能滑动到右边界外
                        if(marginLeft<-delWidth){
                            //滑倒位置即刻停止
                            marginLeft = -delWidth;
                            $(that).removeClass(self.option.touchClass);
                            
                        }
                        if (flag == 0) {
                            var startPoint = {
                                x: startX,
                                y: startY
                            };
                            var movePoint = {
                                x: moveX,
                                y: moveY
                            };
                            var angles = angle(startPoint, movePoint);
                            flag = 1;
                            if (parseInt(angles) < -30 || parseInt(angles) > 30) {
                                if (bounceState == 1) {
                                    appcan.window.enableBounce();
                                }
                                scrollEnable = false;
                            } else {
                                if (parseInt($(that)[0].style.marginLeft) > 0) {
                                    return;
                                }
                                that.style.transitionDuration = "0ms";
                                that.style.left = marginLeft+"px";
                                evt.preventDefault();
                            }
                        } else {
                            if (scrollEnable == false) {
                                return;
                            }
                            if (parseInt($(that)[0].style.marginLeft) > 0) {
                                return;
                            }
                            that.style.transitionDuration = "0ms";
                            that.style.left = marginLeft+"px";
                        }
                    }
                };
                
            }, false);
            self.ele.get(0).addEventListener('touchend', function(evt) {
                var that = evt.target,
                    _cont = $(that).parents('.scrollSelectItem').find('.scrollSelectContent');
                if($(that).parents('.scrollSelectContent').length){
                    that = $(that).parents('.scrollSelectContent').get(0);
                }
                if ($(that).hasClass('scrollSelectContent')) {
                    if (bounceState == 1) {
                        appcan.window.enableBounce();
                    }
                    _cont.removeClass(self.option.touchClass);

                    if (!scrollEnable){
                        return;
                    }
                    _cont.get(0).style.transitionDuration = self.option.duration;
                    if ((startX - moveX) > delWidth / 2) {
                        _cont.get(0).style.left = -delWidth+"px";
                        $(that).parents('.scrollSelectItem').addClass('showOption');
                    } else {
                        _cont.get(0).style.left = "0px";
                        $(that).parents('.scrollSelectItem').removeClass('showOption');
                    }
                };
                //选项事件
                if ($(that).parents('.scrollSelectOptions').length) {
                    var itemIndex = $(that).parents('.scrollSelectItem').data("index");
                    var optionIndex = $(that).index();
                    var itemLength = self.ele.find(".scrollSelectItem").length;
                    _cont.get(0).style.left = "0px";
                    data = self.data;
                    if (typeof self.option.onClick == "function") {
                        self.option.onClick(that, itemIndex, itemLength);
                    }
                }
            }, true);
            container += '</ul>';
            return $(container);
        },
        add: function(newData, dir) {
            var self = this;
            var data = self.data;
            var container = self.buildListview(newData);

            if (dir){
                self.ele.append(container);
                self.data = data.unshift(newData);
            }else {
                var first = self.ele.children().first();
                first.prepend(container);
                self.data = data.push(newData);
            };
            return self.sort();
        },
        set: function(data) {
            var self = this;
            var setFunc = function() {
                var container = self.buildListview(data);
                self.ele.html(container);
                self.data = $.extend(true,[],data);
                return self.sort();
            }
            if (uexWindow.getBounce && typeof uexWindow.getBounce === 'function') {
                //真机无回调，线上打包可用
                appcan.window.getBounceStatus(function(dt, dataType, opId) {
                    bounceState = dt;
                    setFunc();
                });
            } else {
                setFunc();
            }
        },
        delete: function(itemIndex) {
            var self = this;
            var data = self.data;
            self.ele.find(".scrollSelectItem").eq(itemIndex).remove();
            data.splice(itemIndex,1);
            self.data = data;
            self.sort();
        },
        sort: function(){
            var self = this;
            self.ele.find('.scrollSelectItem').each(function(i,e){
                $(e).data('index',i);
            });
            return self;
        }
    };
    module.exports = function(option){
        return new OptionListView(option)
    };
});